<template>
	<view class="w-radio-account">
		<view class="font-size-14 font-color-textPrimary">{{handleLang('收款账号')}}</view>
		<view class="item br-8" :class="{'item-action':type.includes(item.type)}" v-for="(item,idx) in account" :key="idx" @click="changeType(item)">
			<view class="flex flex-ai-center">
				<text class="font-size-14 font-color-textPrimary" :class="{'font-color-222':type.includes(item.type)}">{{ item.name && handleLang(item.name) }}</text>
				<text class="font-size-12 font-color-describe ml-8">{{ item.describe && handleLang(item.describe) }}</text>
			</view>
			<view class="flex-center">
				<view class="goOpen" v-if="item.isOpen==0" @click.stop="openPay(item.type)">{{handleLang('去开通')}}</view>
				<w-icon v-else :name="type.includes(item.type)?'check-icon':'uncheck-icon'" size="18"></w-icon>
			</view>
		</view>
		<w-toast btnType="primary" v-model="servicePop" :title="servicePriceText" @action="actionServicePop"></w-toast>
	</view>
</template>

<script>
	import { openHuiFu,openYiBao,CreateHuifuAccountOrder } from '@/api/wallet/index.js'
	import PayUtil from '@/utils/payUtil.js';
	export default {
		name:"w-radio-account",
		computed:{
			account(){
				let arry = [
					{ name:'钱包A',type:'huifu',describe:'更快更便捷',isOpen:this.userInfo.huifu_account },
					// { name:'易宝钱包',type:'yibao',describe:'更快更便捷',isOpen:this.userInfo.yibao_status }
				]
				return arry
			}
		},
		data() {
			return {
				type:[],
				servicePriceText:'',
				servicePop: false,
			};
		},
		mounted() {
			let default_pay_type = this.appConfig.default_pay_type;
			let defKey = this.account.filter(item =>item.type==default_pay_type && item.isOpen!=0)
			this.type = defKey.length?[defKey[0].type]:[],
			this.$emit('changeIncome',this.type)
		},
		methods:{
			// 复选
			changeType(e){
				let { type,isOpen } = e;
				if(this.type.includes(type)){
					this.type = this.type.filter(item => item != type)
				}else{
					isOpen!=0 && this.type.push(type)
				}
				this.$emit('changeIncome',this.type)
			},
			
			// 去开通
			openPay(type) {
				if (type=='huifu') {
					this.openHuiFuWallet()
				}else if (type=='yibao') {
					this.openYiBaoWallet()
				}
			},
			
			// 获取钱包A开户信息
			async openHuiFuWallet(){
				uni.showLoading({
					title:"请稍后..."
				})
				let res=await openHuiFu();
				if (!res.data.redirect_url) {
					this.servicePriceText = res.data.price
					this.servicePop = true
					return
				}
				this.toWeb(res.data.redirect_url)
			},
			
			// 获取易宝开户信息
			async openYiBaoWallet(){
				uni.showLoading({
					title:"请稍后..."
				})
				let res=await openYiBao();
				this.toWeb(res.data.info.redirect_url)
			},
			
			// 开通钱包手续费
			async actionServicePop(e) {
				if(!e) return;
				uni.showLoading()
				let param = await CreateHuifuAccountOrder();
				new PayUtil({
					pay_type:4,
					pay_way:'huifu',
					order_type:4,
					order_number:param.data.order_sn
				})
			},
			
			toWeb(url){
				// #ifdef H5
					window.location.href=url
				// #endif
				// #ifdef APP-PLUS
					plus.runtime.openURL(url)
				// #endif
			}
		}
	}
</script>

<style lang="scss" scoped>
	.w-radio-account{
		@extend .pa-12,.bg-color-item,.br-12,.mb-12;
		>.item{
			width: 100%;
			height: 96rpx;
			padding: 28rpx 16rpx;
			// background: linear-gradient(209deg, #f5f5f5 0%, #f5f5f5 36%, #f5f5f5 100%);
			margin-top: 24rpx;
			@extend .flex-center-sb;
		}
		>.item-action{
			// background-color: $theme-jb-color;
			// border: 2rpx solid $theme-color;
			border-radius: 16rpx;
		}
		.goOpen{
			padding: 4rpx 16rpx;
			text-align: center;
			line-height: 40rpx;
			border-radius: 50rpx;
			background: $theme-jb-color;
			color: #fff;
			font-size: 24rpx;
		}
	}
</style>